<template>
	<view style="width: 100%;height: 100%;">
		<view style="width: 650rpx;margin: 40rpx;background-color: #ececec;border-radius: 10rpx;height: 70rpx; line-height: 70rpx;
			display: flex;flex-direction: row;align-items: center;">
			<image src="/static/souSuo.png" style="width: 50rpx;height: 40rpx;margin-left: 10rpx;"></image>
			<input style="width: 650rpx;padding-left: 20rpx;
					 padding-right: 20rpx;height: 70rpx;
					 line-height: 70rpx;font-size: 28rpx;" placeholder="请输入关键字"  v-model="inputText"  @input="jianTingShu()"/>
		</view>
		<scroll-view scroll-y="true">
			<view style="width: 100%;margin-bottom: 50rpx;">
				<view style="width: 700rpx;margin-left: 25rpx;margin-right: 25rpx;margin-top: 20rpx;margin-bottom: 20rpx;
				border-radius: 10rpx;background-color: #fff;display: flex;flex-direction: column;align-items: center;"
					v-for="(item,index) in LouPanList" @click="tiaoZhuan(item)">
					<view style="width: 100%;height: 50rpx;text-align: left;">
						<view style="width: 50rpx;height: 50rpx;border-radius: 25rpx;background-color: #ff0000;color: #fff;
						display: flex;flex-direction:row;justify-content: center;align-items: center;font-size: 25rpx;
						
						">
							{{index+1}}
						</view>
					</view>
					
					<view style="width: 100%;display: flex;flex-direction: row;align-items: center;">
						<view  style="width: 250rpx;height:250rpx;display: flex;flex-direction: row;justify-content: center;align-items: center;">
							<image :src="'https://fcc.sdyilian.top/'+item.massif.cover" style="width: 180rpx;height:180rpx;"></image>
						</view>
						
						<view>
							<view style="font-size: 30rpx;color: #000;">{{item.properties_id}}</view>
							<view style="display: flex;flex-direction: row;margin-left: -10rpx;">
								<view v-for="(i,iidex) in item.intel.tag" style="margin: 10rpx;background-color: #ffc0c0; color: #ff0000;
								padding: 10rpx;border-radius: 10rpx;font-size: 20rpx;">
									{{i}}
								</view>
							</view>
							<view style="display: flex;flex-direction: row;color: #999999;">
								<view style="font-size: 25rpx;">{{item.intel.district_id}}</view>
								<view style="margin-left: 10rpx;font-size: 25rpx;">{{item.intel.region_id}}</view>
								<view style="margin-left: 10rpx;font-size: 25rpx;">面积{{item.intel.extent}}</view>
							</view>
							<view
								style="display: flex;flex-direction: row;justify-content: space-between;width: 420rpx;margin-top: 10rpx;">
								<view style="font-size: 25rpx;color: #fa4b2b;font-weight: 700;">
									{{item.intel.total_price}}
								</view>
								<view style="font-size: 23rpx;color: #d5d5d5;">
									
								</view>
							</view>
						</view>
									
					</view>
					
					
					<view style="display: flex;flex-direction: row;
					
					
					margin-left: -10rpx;width: 700rpx;justify-content: space-between;">
					
						<view  style="margin: 10rpx;background-color: #ffc0c0; color: #ff0000;
						padding: 6rpx;border-radius: 10rpx;font-size: 20rpx;margin-left: 30rpx;">
								取证楼座：{{item.title}}#楼
						</view>
				
					
						<view  style="margin: 10rpx;background-color: #ffc0c0; color: #ff0000;
							padding: 6rpx;border-radius: 10rpx;font-size: 20rpx;margin-right: 30rpx;">
									取证日期：{{item.delivertime}}
						</view>
					
					
					</view>
				</view>
				
			 
			</view>
		</scroll-view>
	</view>
</template>

<script>
	var that;
	export default {
		data() {
			return {
				LouPanList:[],
				yLouPanList:[],
				inputText:""
			}
		},
		onLoad(e) {
			that = this;
			that.getList();
		},
		methods: {
			getList(){
				var url = uni.api.API.evidence_collection;
				var parm = {
					
				}
				uni.api.HTTPREQUEST(url, "get", parm,
					that.getListSuss,
					that.getListFail, 1);
			},
			getListSuss(res){
				that.yLouPanList=res.data;
				that.LouPanList=res.data;
			},
			getListFail(msg){
				console.log(msg);
			},
			tiaoZhuan(item){
				
				uni.navigateTo({
					url:'/pages/diKuai/xiangQing/xiangQing?id='+item.id+'&type=2'
				})
			},
			jianTingShu(){
				if(that.inputText==""){
					that.LouPanList=that.yLouPanList;
					return
				}
				var arr=[];
				if(that.yLouPanList!=undefined && that.yLouPanList.length>0){
					for(var i=0;i<that.yLouPanList.length;i++){
						if(that.yLouPanList[i].properties_id.includes(that.inputText)){
							arr.push(that.yLouPanList[i]);
						}	
					}
				}
				that.LouPanList=arr;
			}
		}
	}
</script>

<style>
	page{
		background-color: #f5f5f5;
	}
</style>